<!-- 海外wms详情查询 -->
<template>
  <el-dialog :close-on-click-modal="true" title="上架清单" :visible.sync="visible" custom-class="dialog_big">
    <ex_super_form ref="form" :model="[]" :rules="rules" :label-width="$globalCss.formLabelWidth_default"
      inputClass="w_fill" class="w_fill">

      <template v-slot:form_before="">
        <el-form-item :label="$tt('label_print_client')" prop="clientId">
          <ex_super_input class="flex_cell w_fill" :value="clientIdAndPrintName" type="select" :attrs="{
            url: $url['print/getOnlineClientInWarehouse'],
            listHandler: clientHander,
          }" @changeItem="changeClientPrint" />
        </el-form-item>
        <el-form-item :label="$tt('label_print_copies_count')" prop="printNumSum">
          <ex_super_input class="flex_cell w_fill" v-model="printNumSum" type="input-number" :attrs="{
            min: 1, max: 99,
          }" />
        </el-form-item>
        <el-form-item :label="$tt('上架方式')">
          <!-- <ex_super_input class="flex_cell w_fill" v-model="putawayType" type="select" :attrs="{
            enum: 'PutawayTypeEnum',
            listHandler: (list) => list.filter(it => ['BOX', 'SKU'].includes(it.value)),
          }" /> -->
          <ex_super_table v-bind="skuOption" :data="putPrintRows" class="mg_t2" />
        </el-form-item>
      </template>
    </ex_super_form>
    <span slot="footer" class="dialog_footer">
      <el-button @click="visible = false">{{ $tt('label_cancel') }}</el-button>
      <el-button type="primary" @click="downloadBefore">
        {{ $tt('label_download') }}
      </el-button>
      <el-button type="primary" @click="printBefore">
        {{ $tt('label_client_print') }}
      </el-button>
    </span>
  </el-dialog>
</template>

<script>

export default {
  components: {},
  data() {
    return {
      item: null,
      visible: false,
      clientIdAndPrintName: null,
      loading: false,
      printNumSum: 1,
      clientId: "",
      printerName: "",

      putawayType: '',
      putPrintRows: [],
      skuOption: {
        model: [
          {
            key: 'boxNo', label: 'label_box_code', 'min-width': 130, 'show-overflow-tooltip': true,
          },
          // {
          //   key: 'skuOnlyCode', label: 'label_sku_only_code', 'min-width': 130, 'show-overflow-tooltip': true,
          // },
          // {
          //   key: 'skuName', label: 'label_sku_name', 'width': 130, 'show-overflow-tooltip': true,
          //   formatter: (r, c, v, i) => this.$formatNameCode(v, r.skuNameEn)
          // },
          // { key: 'quantity', 'width': 100, label: 'label_expected_sku_number', },
          // { key: 'receivingQty', 'width': 100, label: 'label_receiving_number', },
          {
            key: 'putawayType', 'width': 180,
            'render-header': (h, { column }) => {
              return h('ex_dropdown_auto', {
                props: {
                  label: '上架方式',
                  buttonType: 'text', i18n: true,
                  items: this.$localEnum.PutawayTypeEnum,
                  listHandler: (list) => list.filter(it => ['BOX', 'SKU'].includes(it.value)),
                },
                on: {
                  command: (e) => {
                    this.putPrintRows.forEach(it => {
                      this.$set(it, 'putawayType', e._value)
                    })
                  }
                },
              }, [
                // h("el-button", { props: { type: 'text' } }, [
                //   '上架方式',
                //   h('i', { class: 'el-icon-arrow-down el-icon--right' })
                // ])
              ])
            },
            render: (h, { row }) => {
              return h('ex_super_input', {
                props: {
                  type: 'select',
                  value: row.putawayType,
                  attrs: {
                    i18n: true,
                    items: this.$localEnum.PutawayTypeEnum,
                    listHandler: (list) => list.filter(it => ['BOX', 'SKU'].includes(it.value)),
                  }
                },
                on: {
                  input: e => this.$set(row, 'putawayType', e)
                },
              })
            }
          },
        ],
      },
      rules: {
        clientId: {
          trigger: 'blur',
          validator: (r, v, cb) => {
            if (_.isEmpty(this.clientId)) {
              return cb(this.$tt("tip_can_no_empty"))
            }
            cb()
          },
        },
        printNumSum: {
          // required: true,
          validator: (r, v, cb) => {
            if (!this.$reg.PureNumber(this.printNumSum)) {
              return cb(this.$tt("tip_only_positive_pure_decimal"))
            }
            cb()
          },
          trigger: 'blur'
        },
      },
    }
  },
  methods: {
    clientHander(list) {
      const out = _.concat([], ...list.map(it => it.printerConfigList.map(pr => {
        return {
          _value: it.clientId + ' - ' + pr.printerName,
          _label: it.customerClientName + ' - ' + pr.printerName + ` - (${pr.paperSize})`,
          clientId: it.clientId,
          printerName: pr.printerName,
        }
      })))
      return out
    },
    changeClientPrint(e) {
      this.clientIdAndPrintName = e._value
      this.clientId = e.clientId
      this.printerName = e.printerName
    },
    downloadBefore() {
      if (this.$clickFast()) return
      this.$downloadFile({
        loading: true,
        window: true,
        url: '/wms-api/inbound/WmsInboundOverseasPutawayRpc/previewPutawayList.json',
        data: {
          id: this.item.id,
          boxNoList: this.putPrintRows.map(it => it.boxNo),
          putawayTypeList: this.putPrintRows.map(it => it.putawayType)
        },
      })
    },
    printBefore() {
      if (this.$clickFast()) return
      this.$refs['form'].validate((valid, obj) => {
        if (valid) {
          this.$ajax({
            url: "/wms-api/inbound/WmsInboundOverseasPutawayRpc/printPutawayList.json",
            method: 'post', type: "json", loading: true,
            data: {
              printList: [
                {
                  clientName: this.clientId,
                  printerName: this.printerName,
                  printCount: this.printNumSum,
                  overseasPutawayListParam: {
                    id: this.item.id,
                    boxList: this.putPrintRows.map(it => {
                      return {
                        boxNo: it.boxNo,
                        putawayType: it.putawayType,
                      }
                    })
                  },
                }
              ]
            },
            success: (res) => {
              this.$message.success(this.$tt('label_submit_print_success'))
              this.visible = false

            }
          })
        } else {
          this.$message.error(this.$tt('form_validate_error'))
          return false;
        }
      });

    },
    show(obj) {


      this.item = obj
      this.$ajax({
        url: "/wms-api/inbound/WmsInboundOverseasPutawayRpc/selectPutawayList.json",
        method: 'post', loading: true,
        data: { id: obj.id },
        success: (res) => {
          if (res && res.data) {
            let TOB = res.data.bizType == 'TOB'
            this.putawayType = TOB ? 'BOX' : 'SKU'
            res.data.boxList.forEach(it => {
              it.putawayType = TOB ? 'BOX' : 'SKU'
            })
            this.putPrintRows = res.data.boxList
            this.visible = true
          }

        }
      })

    },



  }
}
</script>
